import React, { Component } from 'react'
import styles from './VipMyAcc.less'
import moment from 'moment';
 class VipMyAcc extends Component {
    state = {
        remainAcc: 0,
        accList: []
    }
    /* render渲染前 */
    componentWillMount = () => {
        this.setState({
            remainAcc: this.props.remainAcc,
            accList: this.props.accList
        })
    }

    accBodyList = (List) => {
        let arr = []
        {
           List.forEach( v => {
            arr.push(
                <div className={styles.accItem} key={v.acc_id}>
                    <div className={styles.accNameWrap}>
                        <div className={styles.accName}>{v.oper_des}</div>
                        <div>{v.acc_num > 0 ? '+' + v.acc_num : v.acc_num}分</div>
                    </div>
                    <div className={styles.accTime}>
                        {moment(v.ope_date).format('YYYY-MM-DD hh:mm:ss')}
                    </div>
               </div>
            )
           })
        }
        return arr
    }
    render() {
        const {accList = [], remainAcc =  0} = this.props
        return (
            <div>
                <div className={styles.myaccWrap}>
                    <div className={styles.accHeader}>
                        <div>
                            <div className={styles.accNum}>{remainAcc}</div>
                            <div className={styles.acctext}>积分</div>
                        </div>
                    </div>
                    <div className={styles.accInfo}>
                        <div className={styles.accInfoLeft}>积分明细</div>
                        <div className={styles.accInfoRight}>本月</div>
                    </div>
                    <div className={styles.accBody}>
                        {accList.length ? this.accBodyList(accList) : ''}
                    </div>
                </div>
            </div>
        )
    }
}
VipMyAcc.propTypes = {
    remainAcc: React.PropTypes.number,
    accList: React.PropTypes.array,
  };

  export default VipMyAcc